<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
	<style type="text/css">
	html,body{overflow:hidden; height:100%; width:100%;margin:0; padding:0;}
	#back1,#back0{transition: all 0.5s ease-in 0.2s;}
	</style>
</head>
<body>
<div id="back0" style="position:absolute;width:100%;height:100%;margin:0;padding:0; opacity:1;"><img id="img0" style="height:100%;width:100%" src="./images/b.gif" /></div>
<div id="back1" style="position:absolute;width:100%;height:100%;margin:0;padding:0; opacity:0;"><img id="img1" style="height:100%;width:100%" src="images/b.gif" /></div>
<script>
//根据需要设置
var delay=10*60*1000;//轮播时间间隔单位毫秒
var max=13;//共有多少张图片，图片编号必须从1开始如1.png,2.png...
var i=0;
var current=0;
var images=arr_random(max);
var clientWidth=document.documentElement.clientWidth;
var clientHeight=document.documentElement.clientHeight;
var width=height=0;
window.onload=function(){
	width=document.getElementById('img0').width;
	height=document.getElementById('img0').height;
}

var src='./images/'+(images[i]+1)+'.png';
var loading0 = new Image();
loading0.src=src;
document.getElementById('img'+current).src=src;
setTimeout(function () {loadCheck(loading0); }, 50);

window.setInterval(function(){
	i++;
	if(i>=max) i=0;
	src='./images/'+(images[i]+1)+'.png';
	var loading = new Image();
	loading.src=src;
	setTimeout(function () {loadCheck(loading); }, 50);
},delay);
function setImage(){
	var r0=clientWidth/clientHeight;
	var r1=width/height;
	if(r0>r1){//width充满
		w=clientWidth;
		h=w*(height/width);
	}else{
		h=clientHeight;
		w=h*(width/height);
	}
	if(current>0) var current1=0;
	else var current1=1;
	document.getElementById('img'+current1).src=src;
	document.getElementById('img'+current1).style.width=w+'px';
	document.getElementById('img'+current1).style.height=h+'px';
	document.getElementById('back'+current).style.opacity=0;
	document.getElementById('back'+current).style.zIndex=0;
	document.getElementById('back'+current1).style.opacity=1;
	document.getElementById('back'+current1).style.zIndex=1;
	current=current1;
}
function loadCheck(loadding) {
	if(loadding.complete) {
		width = loadding.width;
		height = loadding.height;
		setImage();
	}
};

window.onresize=function(){
	clientWidth=document.documentElement.clientWidth;
	clientHeight=document.documentElement.clientHeight;
	setImage();
}
function arr_random(num) {  
        var arr=[];  
        for (var i = 0; i < num; i++) {  
            arr[i] = i;  
        }  
        for (var i = 0; i < num; i++) {  
            var iRand = parseInt(num * Math.random());  
            var temp = arr[i];  
            arr[i] = arr[iRand];  
            arr[iRand] = temp;  
        }  
        return arr;  
    }  
</script>
</body>
</html>